<template src="./index.html"></template>
<script setup lang="ts">
import { ref, onMounted, computed } from 'vue';
import { onObserver, targetSize } from './tool/boxSize';
let box = ref();
onMounted(() => {
    let size_ = onObserver(box.value);
})
let computedStyle = computed(() => {
    return {
        '--w': targetSize.value.width + 'px',
        '--h': targetSize.value.height + 'px'
    }
})

let scrollBox = ref();
const handleLeft = (e: Event) => {
    scrollBox.value.scrollTop = scrollBox.value.scrollTop + 400
}
const handleRight = (e: Event) => {
    scrollBox.value.scrollTop = scrollBox.value.scrollTop - 200
}
</script>
<style scoped src="./index.css"></style>